﻿var arVersion = navigator.appVersion.split("MSIE");
var version = parseFloat(arVersion[1]);

function round_cornor() {
    if ($("#ckbRound").is(":checked")) {
        $("#card_front").addClass("round");
        $("#card_back").addClass("round");
    } else {
        $("#card_front").removeClass("round");
        $("#card_back").removeClass("round");
    }
}

function selectCardSide(side) {
    if (typeof side == 'undefined') side = 'front';
    $('#card_editor_form_ctn .tab_ctn_nav ul li').removeClass('bg_hover');
    $('#card_editor_form_ctn .tab_ctn_nav ul li.' + side).addClass('bg_hover');

    $('#card_ctn li').removeClass('c');
    $('#card_' + side).addClass('c');

    var objID = "";
    if ($('#card_front').hasClass('c')) {
        objID = "F";
    } else {
        objID = "B";
    }

    $('#EditorYouIfo .form').hide();
    $('#card_form_' + side).show();
}


function loadImg(i, t, d) {
    var txt = $("#" + t + "_txt_" + i);
    var img = $("#" + t + "Img" + i);
    var x = txt.attr("x");
    var y = txt.attr("y");

    var url = imgServer
        + "ImageService.ashx?a=w&e=y"
        + "&w=" + escape(txt.val())
        + "&fs=" + txt.attr("fs")
        + "&ff=" + escape(txt.attr("ff"))
        + "&fc=" + txt.attr("fc").replace("#", "")
        + "&fst=" + txt.attr("fst");

    if (d == "R") {
        img.css('top', y + 'px').css('left', x + 'px');
    } else {
        imgReady(url, function() {
            img.css('top', y + 'px')
               .css('left', (x - this.width) + 'px')
        });
    }

    transparentPNG(img[0]);
    img.attr("src", url);
}

function transparentPNG(img) {
    if ((version >= 5.5) && (version < 7)) {
        img.onreadystatechange = function() {
            if (img.readyState == "complete" && img.src.indexOf("transparent.gif") <= -1) {
                img.runtimeStyle.backgroundImage = "none";
                img.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true', src='" + img.src + "', sizingMethod='image')";
                img.src = "transparent.gif";
            }
        }
    }
}

function settingLogoSize(imageID, addWidth, subWidth, toWidth) {
    var logo = $("#" + imageID);

    if (addWidth > 0) {
        if (isNaN(addWidth)) {
            $("#w_" + imageID).val(logo.attr("w"));
        } else {
            toWidth = new Number(accAdd(addWidth, logo.attr("w"))).toFixed(0);
        }
    } else if (subWidth > 0) {
        if (isNaN(subWidth)) {
            $("#w_" + imageID).val(logo.attr("w"));
        } else {
            toWidth = new Number(accSub(logo.attr("w"), subWidth)).toFixed(0);
        }
    }

    if (toWidth) {
        if (isNaN(toWidth)) {
            $("#w_" + imageID).val(logo.attr("w"));
        } else if (toWidth <= 0) {
            $("#w_" + imageID).val("0");
            logo.attr("w", "0");
            logo.attr("h", "0");
            logo.width("0px");
            logo.height("0px");
        } else if (toWidth > 0) {
            toWidth = new Number(toWidth).toFixed(0);
            $("#w_" + imageID).val(toWidth);
            var height = logo.attr("oh");
            var toHeight = new Number(accMul(accDiv(toWidth, logo.attr("ow")), height)).toFixed(0);
            logo.attr("w", toWidth);
            logo.attr("h", toHeight);
            logo.width(toWidth + "px");
            logo.height(toHeight + "px");
        }
    }
}

function saveMP(callback) {
    loading();

    function getFields(faceType) {
        var fields = "";
        $("input[id^='" + faceType + "_txt_']").each(function() {
        fields += (escape($(this).val())) + "|" + $(this).attr("s") + "|" + $(this).attr("x") + "|" + $(this).attr("y") + "|" + $(this).attr("d") + "|" + escape($(this).attr("fc")) + "|" + $(this).attr("fs") + "|" + escape($(this).attr("ff")) + "|" + $(this).attr("fst") + "||";
        });
        return fields;
    };

    $.ajax({
        type: "POST",
        url: "/CardService.ashx?a=sm",
        timeout: 10000,
        data: {
            'fieldsF': getFields("F"),
            'fieldsB': getFields("B"),
            'cinfo': $("#hndInfo").val(),
            'logoF': getLogoInfo($("#FLImg")),
            'logoB': getLogoInfo($("#BLImg")),
            'cid': $("#hndUserCardID").val()
        },
        success: function(data) {
            var result = eval("(" + data + ")")
            if (callback) {
                callback.call(this, result);

            } else {
                if (result.r == "y") {
                    $("#hndUserCardID").val(result.cid);
                    close_loading();
                    alert("保存成功！");
                } else {
                    close_loading();
                    alert("保存失败！");
                }
                close_shade();
            }
        },
        error: function() {
            close_loading();
            alert("保存失败,请重试！");
            close_shade();
        }
    });

}

function getLogoInfo(logo) {
    if (logo.length > 0 && logo.attr("src").indexOf("transparent.gif") < 0) {
        return logo.attr("p") + "|" + logo.attr("w") + "|" + logo.attr("h") + "|" + logo.attr("ow") + "|" + logo.attr("oh") + "|" + logo.attr("x") + "|" + logo.attr("y") + "|" + logo.is(":hidden");
    }
    return "";
}

function printMP() {
    saveMP(gotoPrintMP);
}

function gotoPrintMP(result) {
    if (result.r == "y") {
        //$("#hndUserCardID").val(result.cid);
        window.location = "OnlinePrint.aspx?id=" + result.cid;
    }
}


function picklogo(im, callback) {
    if ($("#logo-picker").length <= 0) {
        $(document.forms[0]).append("<div id='logo-picker' style='display:none;'><iframe src='LogoPicker.aspx?im=" + im + "' scrolling='no' frameborder=no style='border:0;width:330px;height:320px;background-color:#EEEEEE;' /></div>");
    }

    $("#logo-picker").dialog({
        close: function() {
            $("#logo-picker").dialog("destroy");
            $("#logo-picker").remove();
            callback ? callback.call() : "";
        },
        width: 360,
        height: 380,
        modal: true
    });
}

function resetLogo(imageID, width, height, src) {
    var logo = $("#" + imageID);
    var url = imgServer + "logoImages/" + src;
    $("#" + imageID + "_t").attr("src", url)
    logo.attr("src", url);
    logo.width(width + "px");
    logo.height(height + "px");
    logo.attr("w", width);
    logo.attr("h", height);
    logo.attr("ow", width);
    logo.attr("oh", height);
    logo.attr("p", src);
}

function closePicklogo() {
    $("#logo-picker").dialog("close");
}

function uploadUserLogo(im) {
    if ($("#logo-upload").length <= 0) {
        $(document.forms[0]).append("<div id='logo-upload' style='display:none;'><iframe src='/member/UploadLogo.aspx?im=" + im + "' scrolling='no' frameborder=no style='border:0;width:330px;height:100px;background-color:#EEEEEE;' /></div>");
    }

    $("#logo-upload").dialog({
        close: function() {
            $("#logo-upload").dialog("destroy");
            $("#logo-upload").remove();
        },
        width: 380,
        height: 160,
        modal: true
    });
}

function closeUploadUserLogo() {
    $("#logo-upload").dialog("close");
}

function toggleLogo(imageID) {
    if ($("#toggle-logo-" + imageID).text() == "隐藏LOGO") {
        $("#toggle-logo-" + imageID).text("显示LOGO");
        $("#" + imageID).hide();
    } else {
        $("#toggle-logo-" + imageID).text("隐藏LOGO");
        $("#" + imageID).show();
    }
}


function modify_detail(faceType, sort) {

    var tr = $("#" + faceType + "_tr_" + sort);
    var tb = $("#" + faceType + "_tb_" + sort);

    $(".d_tr").each(function() {
        if ($(this).attr("id") != (faceType + "_tr_" + sort) && $(this).attr("id") != "{FACE}_tr_{SORT}") {
            $(this).hide();
            $("#" + $(this).attr("f") + "_tb_" + $(this).attr("s")).removeClass("focus_tb");
        }
    });

    tr.is(":visible") ? (tr.hide(), tb.removeClass("focus_tb")) : (tr.show(), tb.addClass("focus_tb"));
}

function chage_family(faceType, sort, direction) {
       
    $("#" + faceType + "_txt_" + sort).attr("ff", $("#" + faceType + "_ff_" + sort).val());
    loadImg(sort, faceType, direction);
}

function set_style(ele, faceType, sort, direction) {
    var style="";
    if ($(ele).hasClass("f_style_on")) {
        $(ele).removeClass("f_style_on");
    } else {
        $(ele).addClass("f_style_on");
    }
    $("#" + faceType + "_fts_" + sort).children().each(function() {
        if ($(this).hasClass("f_style_on")) {
            style = style + $(this).attr("v") + ",";
        }
    });
    $("#" + faceType + "_txt_" + sort).attr("fst", style);
    
    loadImg(sort, faceType, direction);
}

function chage_font_size(val, faceType, sort) {
    var txt = $("#" + faceType + "_txt_" + sort);
    txt.attr("fs", (new Number(txt.attr("fs")) + val).toFixed(0));

    loadImg(sort, faceType, txt.attr("d"));
}

function dragField(field) {
    $(field).draggable({ containment: 'parent', stop: function() {
        var parentHeight = $(this).parent().height();
        var parentWidth = $(this).parent().width();
        var input = $("#" + $(this).attr("t") + "_txt_" + $(this).attr("s"));
        var height = $(this).height();
        var width = $(this).width();

        var x = $(this).css("left").replace("px", "");
        var y = $(this).css("top").replace("px", "");

        if (x < 10) {
            $(this).css("left", "10px")
            x = 10;
        }

        var right = parentWidth - x - width;

        if (right < 10 && (parentWidth -20 - right - width) > 0) {
            $(this).css("left", (x - 10) + "px");
        }

        if (y < 10) {
            $(this).css("top", "10px")
            y = 10;
        }

        var bottom = parentHeight - 10 - height - y;

        if (bottom < 10 && (parentHeight - 20 - bottom - height) > 0) {
            $(this).css("top", (y - 10) + "px");
        }


        if (input.attr("d") == "R") {
            input.attr("x", $(this).css("left").replace("px", ""));
        } else {
            input.attr("x", new Number(accAdd($(this).css("left").replace("px", ""), $(this).css("width").replace("px", ""))).toFixed(0));
        }
        input.attr("y", $(this).css("top").replace("px", ""));
    }
    });

    $(field).hover(
                    function() { $(this).css("cursor", "move") },
                    function() { $(this).css("cursor", "hand") }
                );
}

function dragLogo() {
    $("img[id$=LImg]").each(function() {
        $(this).draggable({ containment: 'parent', stop: function() {
            $(this).attr("x", $(this).css("left").replace("px", ""));
            $(this).attr("y", $(this).css("top").replace("px", ""));
        }
        });
        $(this).hover(
                    function() { $(this).css("cursor", "move") },
                    function() { $(this).css("cursor", "hand") }
                );
    });
}

function delete_image(faceType, sort) {
    if (confirm("确定删除该字段？")) {
    }
}


function dialog_add_field() {
    $("#add_field").dialog({
        close: function() {
            $("#content").val("");
        },
        width: 350,
        height: 150,
        modal: true
    });
}

function add_field() {
    if ($.trim($("#content").val()) == "") {
        alert("请输入字段文本！");
        $("#content").focus();
        return;
    }
    var faceType = $('input[name="rdbFaceType"]:checked').val();
    var sort = 0;

    $("input[id^=" + faceType + "_txt_]").each(function() { sort = sort < new Number($(this).attr("s")) ? new Number($(this).attr("s")) : sort; });
    sort = sort + 1;

    var fieldHTML = $("#emptyField").html().replace(/{FACE}/g, faceType).replace(/{SORT}/g, sort).replace(/{CONTENT}/g, $("#content").val());
    var imageHTML = $("#emptyFieldImg").html().replace(/{FACE}/g, faceType).replace(/{SORT}/g, sort);

    if (faceType == "F") {
        $("#card_form_front").append(fieldHTML);
        $("#card_front").append(imageHTML);
    } else {
        $("#card_form_back").append(fieldHTML);
        $("#card_back").append(imageHTML);
    }
    $("#add_field").dialog("close");

    dragField($("#" + faceType + "Img" + sort));

    $("#c_" + faceType + "_txt_" + sort).colorpicker({ history: true }).on("change.color", function(event, color) {
        var field = $("#" + $(this).attr("f") + "_txt_" + $(this).attr("s"));
        field.attr("fc", color);
        loadImg($(this).attr("s"), $(this).attr("f"), field.attr("d"));
    });

    loadImg(sort, faceType, "R");
}

var lstOrder = (function() {
    var lst_orders;
    var default_lst_order = [
    { "uname": "李西*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|荷兰白卡纸|无微调|5盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "李丽*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|荷兰白卡纸|无微调|2盒", "time": "2013-02-13 13:55:20", "status": "待确认" },
    { "uname": "王忘*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|荷兰白卡纸|无微调|3盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "张*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|铜版纸覆膜|无微调|10盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "李晚*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|铜版纸覆膜|有微调|2盒", "time": "2013-02-13 13:55:20", "status": "已发货" },
    { "uname": "孙*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|铜版纸覆膜|无微调|10盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "张昭*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|荷兰白卡纸|无微调|2盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "金囍*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|铜版纸覆膜|无微调|5盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "吉*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|荷兰白卡纸|无微调|5盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "李咯*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|铜版纸覆膜|有微调|2盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "于义*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|荷兰白卡纸|无微调|6盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "杨*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|铜版纸覆膜|无微调|2盒", "time": "2013-02-13 13:55:20", "status": "完成" },
    { "uname": "魏伟*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|铜版纸覆膜|无微调|10盒", "time": "2013-02-13 13:55:20", "status": "完成" },
    { "uname": "郜*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|荷兰白卡纸|有微调|1盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "陈晓*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|荷兰白卡纸|无微调|1盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "胡*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|铜版纸覆膜|有微调|2盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "邢言*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|铜版纸覆膜|无微调|5盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "欧阳吉*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|铜版纸覆膜|有微调|2盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "昊坤*", "tname": "彩色抽象型树叶个性名片", "desc": "圆角|铜版纸覆膜|无微调|10盒", "time": "2013-02-13 13:55:20", "status": "制作中" },
    { "uname": "王莉*", "tname": "彩色抽象型树叶个性名片", "desc": "直角|荷兰白卡纸|有微调|2盒", "time": "2013-02-13 13:55:20", "status": "制作中"}];


    var add_order = function(i) {
        $("#tb_order").append(
            "<tr index='" + i + "' style='height: 30px;' class='o'>"
            + "  <td>" + unescape(lst_orders[i].uname) + "</td>"
            + "  <td>" + unescape(lst_orders[i].tname) + "</td>"
            + "  <td>" + unescape(lst_orders[i].desc) + "</td>"
            + "  <td>" + unescape(lst_orders[i].time) + "</td>"
            + "  <td>" + unescape(lst_orders[i].status) + "</td>"
            + "</tr>");
    };

    var start_silder = function() {
        setInterval(function() {
            var tb = $("#tb_order");
            var top = new Number($("#tb_order").css("margin-top").replace("px", ""));
            if (top > (tb.offset().top * (-1))) {
                tb.css("margin-top", (top - 1) + "px");
            } else {
                $("#tb_order").css("margin-top", "0px");
            }
        }, 50);
    };

    return function() {
        $.get("/CardService.ashx?a=go&r=20", function(data) {
            try {
                lst_orders = eval("(" + data + ")");

                if (lst_orders.length < 20) {
                    for (var i = lst_orders.length; i < 20; i++) {
                        lst_orders[i] = default_lst_order[i];
                    }
                }
            } catch (e) {
                lst_orders = default_lst_order;
            }
            $("#order_silder").show();
            for (var j = 0; j < lst_orders.length; j++) {
                add_order(j);
            }

            start_silder();
        });
    };
})();

$(function() {
    $(".f_style").each(function() {
        var txtID = $(this).attr("s") + "_txt_" + $(this).attr("f");
        if (txtID != "{FACE}_txt_{SORT}") {
            var style = $("#" + txtID).attr("fst");
            if (style.indexOf($(this).attr("v")) >= 0) {
                $(this).addClass("f_style_on");
            }
        }
    });

    $("input[id^=F_txt_]").each(function() {
        $(this).keyup(function() {
            loadImg($(this).attr("s"), "F", $(this).attr("d"));
        });
        loadImg($(this).attr("s"), "F", $(this).attr("d"));
    });

    $("input[id^=B_txt_]").each(function() {
        $(this).keyup(function() {
            loadImg($(this).attr("s"), "B", $(this).attr("d"));
        });
        loadImg($(this).attr("s"), "B", $(this).attr("d"));
    });

    if ((version >= 5.5) && (version < 7)) {
        $(".mplogo").each(function() {
            this.runtimeStyle.backgroundImage = "none";
            this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='scale')";
            this.src = "/transparent.gif";
        })
    }

    $("img[id^=FImg]").each(function() {
        dragField(this);
    });

    $("img[id^=BImg]").each(function() {
        dragField(this);
    });

    $("input[id^=c_]").each(function() {
        if ($(this).attr("id") != "c_{FACE}_txt_{SORT}") {
            $(this).colorpicker({ history: true, strings: "颜色选择,标准颜色,更多颜色,标准颜色,返回,历史,没有历史颜色." }).on("change.color", function(event, color) {
                var field = $("#" + $(this).attr("f") + "_txt_" + $(this).attr("s"));
                field.attr("fc", color);
                loadImg($(this).attr("s"), $(this).attr("f"), field.attr("d"));
            });
        }
    });

    dragLogo();

    lstOrder();
}
);